<html>
    <head>
        <title>如何注册 Action</title>
    </head>
    <body>
        <script>
            /*
                        二、如何注册 action

                                    让我们来注册一个简单的 action:

                                        // 页面路径 ：  store/index.js

                                        import Vue from 'vue'
                                        import Vuex from 'vuex'

                                        Vue.use(Vuex);

                                        const store = new Vuex.Store({
                                            state:{
                                                count:1
                                            },
                                            mutations:{
                                                add(state){
                                                    // 变更状态
                                                    state.count +=2
                                                }
                                            },
                                            actions:{
                                                addCountAction(context){   // action 本质就是封装突变 
                                                    context.commit('add')
                                                }
                                            }
                                        })


                                        export default store;


                                   Action 函数接受一个与 store 实例具有相同方法和属性的 context 对象，因此你可以调用  context.commit  提交一个  mutation ,

                                   或者通过 context.state 和 context.getters 来获取 state 和 getters

                                   实践中，我们会经常用到 ES2015 的参数结构来简化代码 (特别是我们需要调用  commit 很多次的时候)：

                                        actions:{
                                            // 参数解构
                                            addCountAction({commit}){
                                                commit('add')
                                            }
                                        }
                    */
        </script>
    </body>
</html>